<template>
  <table-where :forms="forms" />
  <edit-table ref="editTableRef" :editTbleDatas="editTbleDatas"></edit-table>
</template>

<script setup name="编辑菜单">
import { reactive, ref, onActivated } from 'vue'
import { POSTJSON } from '@/components/utils/http'
import {useRouterParams} from '@/store/routerParams';
const routerParams = useRouterParams()


// import { useRoute } from 'vue-router';
// const route = useRoute();
const editTableRef = ref()
const editTbleDatas = reactive({
  head: [
    { name: '编号', value: 'serial_number', type: 'input', rule: { required: true } },
    { name: '父级编号', value: 'parent_number', type: 'input', rule: { required: false } },
    { name: '名称', value: 'menu_name', type: 'input', rule: { required: true } },
    { name: '是否末级', value: 'menu_level', type: 'switch', options: { true: 0, false: 1 }, rule: { required: true } },
    { name: '地址', value: 'url', type: 'input', rule: { required: true } },
    {
      name: '状态',
      value: 'stat',
      type: 'select',
      options: [
        { label: '有效', value: 1 },
        { label: '无效', value: 0 }
      ]
    }
  ],
  editData: [],
  getRow: () => {
    return {
      menu_level: 0
    }
  }
})
onActivated(()=>{
  const name = '/addMenu'
  if(routerParams.routerParam[name]){
    if(routerParams.routerParam[name].params){
      const row = Object.assign({},routerParams.routerParam[name].params);
      editTbleDatas.editData = []
      editTbleDatas.editData.push(row)
    }else{
      editTbleDatas.editData = []
    }
    delete routerParams.routerParam[name]
  }
})

const save = () => {
  if (editTableRef.value.tableRules()) {
    POSTJSON('/Menu/addMenu', editTbleDatas.editData[0]).then(data => {
      if (data.code >= 1) {
        editTbleDatas.editData = []
      }
    })
  }
}
const forms = reactive({
  data: {},
  rules: [],
  compValue: [
    {
      label: '添加',
      type: 'button',
      onclick: () => {
        editTbleDatas.editData.push(editTbleDatas.getRow())
      }
    },
    { label: '保存', type: 'button', onclick: save }
  ]
})
</script>
